<%@page contentType="text/html; charset=UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<c:set var="ctx" value="${pageContext.request.contextPath}" />

<div id="open">
	<!--  -->
	<div class="banner">
		<div class="">
			<!-- 标题   -->
			<div class="container">
            <div id="type-nav" class="sort-row" style="float:left;">
	      		 <span id="open-category"></span>
            </div>
            <div class="title-sub" id="sum_gather">xxxx</div>
           </div>
			<!-- 轮播框 -->
			<div id="banner" class="carousel slide ">
				<div class="carousel-inner container" id="banner-carousel"></div>
				<a class="left carousel-control" href="#banner" data-slide="prev">‹</a>
				<a class="right carousel-control" href="#banner" data-slide="next">›</a>
			</div>
		</div>
	</div>
	<!-- tab 详细 -->
	<div class="site-focus" id="tab">
	</div>

</div>


<!-- 分类选择服务分类选项 -->
<script type="text/html" id="peojectFl-template">
<$for(var i = 0;i<projectCategories.length;i++){$>
	<a key="3" data="<$=projectCategories[i].id$>" class="project_kind" href="#<$=projectCategories[i].categoryName$>"><$=projectCategories[i].categoryName$></a> 
<$}$>										
</script>







<!-- 轮播框模板 -->
<script type="text/html" id="carousel-template">
	<$ for (var i = 0; i < result.length; i ++) { $>
		<div class="item">
		<a class="span" style="width:78%" href="${ctx }/project/preferential/detail?id=<$=result[i].id$>" target="_blank">
			<img src="<$= result[i].photoUrl$>/744x279/" alt="Slide <$=i$>" style="width:100%;min-height:350px;">
		</a>
		<ul class="project-one-title span" style="width:22%;margin-left:0;">
		<li class="project-title-roll" style="min-height:150px;">
		<a class="project-title-msg" href="${ctx }/project/preferential/detail?id=<$=result[i].id$>" title="">
		<$= result[i].name$>
		</a>
		<span style="max-height:120px;display:block;overflow:hidden">
		<$= result[i].description$>
		</span>
		</li>
			
		<div class="clearfix"></div>
		</div>
		</li>
		</ul>
		</div>
	<$}$>
</script>
<!-- 分类服务详细 -->
<script type="text/html" id="proFlDetail-template">
<$for(var i = 0;i < projectCategories.length;i++) {$>
<div class="container">
	<div class="wrap2">
			<div class="hot-project-box">
				<!-- title -->
				<div class="mod-title clearfix">
					<div id="FlHead"><a key="3" data="<$=projectCategories[i].id$>" class="project_kind pull-left"
						 name="<$=projectCategories[i].categoryName$>"><$=projectCategories[i].categoryName$></a>
					</div>
					<div class="title-sub">
						<span>共 XXX 个服务</span>
					</div>
				</div>
				<!-- 文字介绍 -->
				<div class="titdd-article">这里是说明</div>
				<!-- hot project -->
				<div class="hot-project">
					<div class="pro-handle" id="kind<$=projectCategories[i].id$>"></div>
					<div class="project-more">
						<a class="more-btn" href="#" target="_blank">查看更多服务</a>
					</div>
				</div>
			</div>
		</div>
</div>
<$}$>

</script>
				<!-- 渲染前四个服务数据 -->
				<script type="text/html" id="project-template">
					<div class="row-fluid thumbnails">
						<$if(result.length==0){$>
							<span class="empty-center" style="line-height:320px;">亲~该板块还没有活动</span>
						<$}$>
					
						<$for(var i = 0;i<result.length;i++){$>
						<$if(i%4==0) {$>
						<li class="span3 proj-brief" id="pro_<$=i$>" style="margin-left:0px;">
						<$} else {$>
						<li class="span3 proj-brief" id="pro_<$=i$>" >
						<$}$>
							<div class="thumbnail">								
								<a href="${ctx }/project/preferential/detail?id=<$= result[i].id $>" title="">	
										<div class="imgframe">
											<div class="img-box">
												<img data-src="holder.js/300x200" alt="300x200" src="<$=result[i].photoUrl$>" style="width:100%;height:100%">
											</div>
										</div>
								</a>
							
								<div class="caption">
									<ul class="project-one">
										<li class="project-title">
											<a href="${ctx }/project/preferential/detail?id=<$= result[i].id $>" title=""><b><$= result[i].name $></b> 
											</a>
										</li>
										<li>
											<div style="height:80px;overflow:hidden;">
												<$=result[i].description$>
											</div>
										</li>									
									</ul>
								</div>
							</div>
						</li>
					<$}$>
				</div>
			</div>
			</script>
<a href="#top" class="back_top"></a>
<c:if test="${env == 'production' }">
	<script type="text/javascript">
	seajs.use("${ctx}/assets/js-dist/project/recommend-page");
	</script>
</c:if>
<c:if test="${env != 'production' }">
	<script type="text/javascript">
	seajs.use("${ctx}/assets/js/project/open");
	</script>
</c:if>